<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>在线考试平台</title>
    <link rel="shortcut icon" href="../images/exam.png" type="image/x-icon">
    <link rel="stylesheet" href="../css/font.css">
    <link rel="stylesheet" href="../css/xadmin.css">

</head>

<body>
<div class="layui-fluid">
    <div class="layui-row layui-col-space15" style="background: #f7f8fc">
        <form class="layui-form layui-form-pane" action="" lay-filter="example">
            <div class="layui-form-item">
                <label class="layui-form-label">试卷名</label>
                <div class="layui-input-block">
                    <input type="text" name="exam_paper_name" lay-verify="required" autocomplete="off"
                           placeholder="请输入内容"
                           class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">所属科目</label>
                <div class="layui-input-block">
                    <select lay-filter="test" name="s_id" class="subject">
                    </select>
                </div>
            </div>
            <div class="layui-form-item" pane="">
                <label class="layui-form-label">试卷难度</label>
                <div class="layui-input-block">
                    <input type="radio" lay-filter="test" name="exam_paper_level" value="随机" title="随机" checked="">
                    <input type="radio" lay-filter="test" name="exam_paper_level" value="简单" title="简单">
                    <input type="radio" lay-filter="test" name="exam_paper_level" value="中等" title="中等">
                    <input type="radio" lay-filter="test" name="exam_paper_level" value="困难" title="困难">
                    <!--                        <select lay-filter="test" name="exam_paper_level">-->
                    <!--                            <option value="随机">随机</option>-->
                    <!--                            <option value="简单">简单</option>-->
                    <!--                            <option value="中等">中等</option>-->
                    <!--                            <option value="困难">困难</option>-->
                    <!--                        </select>-->
                </div>
            </div>

            <div class="layui-form-item">
                <div class="layui-inline">
                    <label class="layui-form-label">单选题数量</label>
                    <div class="layui-input-block">
                        <input type="text" name="choice_question_total" readonly="readonly" autocomplete="off"
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">判断题数量</label>
                    <div class="layui-input-inline">
                        <input type="text" name="judgment_question_total" readonly="readonly" autocomplete="off"
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">填空题数量</label>
                    <div class="layui-input-inline">
                        <input type="text" name="fill_blanks_question_total" readonly="readonly" autocomplete="off"
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">简答题数量</label>
                    <div class="layui-input-inline">
                        <input type="text" name="short_answer_question_total" readonly="readonly" autocomplete="off"
                               class="layui-input">
                    </div>
                </div>
            </div>
            <div class="layui-form-item" pane="">
                <label class="layui-form-label">组卷方式</label>
                <div class="layui-input-inline">
                    <input type="radio" lay-filter="creat_exam_paper_way" name="creat_exam_paper_way" value="0"
                           title="手动组卷">
                </div>
                <div class="layui-input-inline">
                    <input type="radio" lay-filter="creat_exam_paper_way" name="creat_exam_paper_way" value="1"
                           title="自动组卷" checked>
                </div>
                <div class="layui-form-mid layui-word-aux"><span style="color: red">*</span>选择的题目数量必须小于题库总数量</div>
            </div>
            <div id="question_num">
                <div class="layui-form-item">
                    <label class="layui-form-label">单选题</label>
                    <div class="layui-input-inline">
                        <select lay-filter="choice_question_num" name="choice_question_num">
                            <option value="0">请选择(默认0)</option>
                            <option value="10">10道</option>
                            <option value="15">15道</option>
                            <option value="20">20道</option>
                            <option value="25">25道</option>
                        </select>
                    </div>
                    <label class="layui-form-label">判断题</label>
                    <div class="layui-input-inline">
                        <select lay-filter="judgment_question_num" name="judgment_question_num">
                            <option value="0">请选择(默认0)</option>
                            <option value="5">5道</option>
                            <option value="10">10道</option>
                            <option value="15">15道</option>
                        </select>
                    </div>
                    <label class="layui-form-label">填空题</label>
                    <div class="layui-input-inline">
                        <select lay-filter="fill_blanks_question_num" name="fill_blanks_question_num">
                            <option value="0">请选择(默认0)</option>
                            <option value="5">5道</option>
                            <option value="10">10道</option>
                            <option value="15">15道</option>
                        </select>
                    </div>
                    <label class="layui-form-label">简答题</label>
                    <div class="layui-input-inline">
                        <select lay-filter="short_answer_question_num" name="short_answer_question_num">
                            <option value="0">请选择(默认0)</option>
                            <option value="2">2道</option>
                            <option value="3">3道</option>
                            <option value="4">4道</option>
                        </select>
                    </div>
                </div>
            </div>

            <div id="exam_paper_way_content">
                <div class="layui-form-item">
                    <label class="layui-form-label">单选题</label>
                    <div class="layui-input-block">
                        <div id="choice_question" style="width: 300px"></div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">判断题</label>
                    <div class="layui-input-block">
                        <div id="judgment_question" style="width: 300px"></div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">填空题</label>
                    <div class="layui-input-block">
                        <div id="fill_blanks_question" style="width: 300px"></div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">简答题</label>
                    <div class="layui-input-block">
                        <div id="short_answer_question" style="width: 300px"></div>
                    </div>
                </div>
            </div>
            <div class="layui-form-item">
                <button class="layui-btn" lay-submit="" lay-filter="add_exam_paper">提交</button>
            </div>
        </form>
    </div>
</div>
</body>
<script type="text/javascript"  src="../lib/layui/layui.js"></script>
<script type="text/javascript" src="../js/xadmin.js"></script>
<script type="text/javascript" src="../js/jquery.min.js"></script>
<script>

    var choice_question;
    var judgment_question;
    var short_answer_question;
    var fill_blanks_question;
    var choice_question_data = [];//存放选择题数组
    var judgment_question_data = []; //存放判断题数组
    var short_answer_q_data = []; //存放简答题数组
    var fill_blanks_q_data = []; //存放填空题数组


    layui.config({
        base: '../xmSelect/'
    }).extend({
        xmSelect: 'xm-select'
    }).use(['element', "form", 'jquery', 'layer', 'xmSelect'], function () {
        const form = layui.form;
        const $ = layui.jquery;
        const layer = layui.layer;
        const element = layui.element;
        const xmSelect = layui.xmSelect;
        $("#exam_paper_way_content").hide();
        get_all_subject();
        get_question_total();
        initialization_method();


        form.on("submit(add_exam_paper)", function (data) {
            const exam_paper_name = data.field.exam_paper_name;
            const s_id = data.field.s_id;
            const exam_paper_level = data.field.exam_paper_level;
            const creat_exam_paper_way = data.field.creat_exam_paper_way;
            var choice_question_ids;
            var judgment_question_ids;
            var short_answer_question_ids;
            var fill_blanks_question_ids;

            if (creat_exam_paper_way === "0") {
                //手动组卷
                choice_question_ids = choice_question.getValue('value').toString();
                judgment_question_ids = judgment_question.getValue('value').toString();
                short_answer_question_ids = short_answer_question.getValue('value').toString();
                fill_blanks_question_ids = fill_blanks_question.getValue('value').toString();
            }else {
                //自动组卷
                const choice_question_num = data.field.choice_question_num;
                const judgment_question_num = data.field.judgment_question_num;
                const short_answer_question_num = data.field.short_answer_question_num;
                const fill_blanks_question_num = data.field.fill_blanks_question_num;

                var new_choice_question_data =getArrayItems(choice_question_data,Number(choice_question_num));
                var choice_question_ids_data=[];
                for (let i = 0; i < new_choice_question_data.length; i++) {
                    choice_question_ids_data.push(new_choice_question_data[i].value)
                }
                choice_question_ids=choice_question_ids_data.toString();

                var new_judgment_question_data =getArrayItems(judgment_question_data,Number(judgment_question_num))
                var judgment_question_ids_data=[];
                for (let i = 0; i < new_judgment_question_data.length; i++) {
                    judgment_question_ids_data.push(new_judgment_question_data[i].value)
                }
                judgment_question_ids=judgment_question_ids_data.toString();

                var short_answer_question_data =getArrayItems(short_answer_q_data,Number(short_answer_question_num))
                var short_answer_question_ids_data=[];
                for (let i = 0; i < short_answer_question_data.length; i++) {
                    short_answer_question_ids_data.push(short_answer_question_data[i].value)
                }
                short_answer_question_ids=short_answer_question_ids_data.toString();


                var fill_blanks_question_data =getArrayItems(fill_blanks_q_data,Number(fill_blanks_question_num))
                var fill_blanks_question_ids_data=[];
                for (let i = 0; i < fill_blanks_question_data.length; i++) {
                    fill_blanks_question_ids_data.push(fill_blanks_question_data[i].value)
                }
                fill_blanks_question_ids=fill_blanks_question_ids_data.toString();

            }
            $.ajax({
                url: 'add_exam_paper',
                dataType: "json",//数据格式
                type: "post",//请求方式
                async: false,//是否异步请求
                data: {
                    ep_name: exam_paper_name,
                    s_id: s_id,
                    ep_level: exam_paper_level,
                    ep_scq_c_ids: choice_question_ids,
                    ep_jq_j_ids: judgment_question_ids,
                    ep_saq_sa_ids: short_answer_question_ids,
                    ep_fbq_fb_ids: fill_blanks_question_ids,
                },
                success: function (data) {
                    if (data.code === 0) {
                        layer.msg(data.message, {icon: 5, time: 1000})
                    } else if (data.code === 200) {
                        layer.confirm(data.message, {icon: 6}, function () {
                            parent.xadmin.add_tab('试卷详细', 'get_exam_paper?ep_id=' + data.result);
                        })
                    } else {
                        layer.msg('系统繁忙', {icon: 5, time: 1000})
                    }
                },
                error: function (e) {
                    alert("出现错误！！");
                }
            });
            return false

        });

    });

    function get_question_total() {
        layui.use(['element', "form", 'jquery', 'layer'], function () {
            const form = layui.form;
            const $ = layui.jquery;
            const layer = layui.layer;
            const element = layui.element;
            const data = form.val("example");
            const s_id = data.s_id;
            const question_level = data.exam_paper_level;


            choice_question = xmSelect.render({
                el: '#choice_question',
                filterable: true,
                paging: true,
                pageSize: 10,
                autoRow: true,
                model: {
                    label: {
                        block: {
                            template: function (item, sels) {
                                return item.value;
                            },
                        },
                    }
                },
                template({item, sels, name, value}) {
                    return item.name + '<span style="position: absolute; right: 10px; color: #8799a3">' + value + '</span>'
                },
                toolbar: {
                    show: true,
                },
                data: []
            })
            judgment_question = xmSelect.render({
                el: '#judgment_question',
                filterable: true,
                paging: true,
                pageSize: 10,
                autoRow: true,
                model: {
                    label: {
                        block: {
                            template: function (item, sels) {
                                return item.value;
                            },
                        },
                    }
                },
                template({item, sels, name, value}) {
                    return item.name + '<span style="position: absolute; right: 10px; color: #8799a3">' + value + '</span>'
                },
                toolbar: {
                    show: true,
                },
                data: []
            })
            short_answer_question = xmSelect.render({
                el: '#short_answer_question',
                filterable: true,
                paging: true,
                pageSize: 10,
                autoRow: true,
                toolbar: {
                    show: true,
                },
                model: {
                    label: {
                        block: {
                            template: function (item, sels) {
                                return item.value;
                            },
                        },
                    }
                },
                template({item, sels, name, value}) {
                    return item.name + '<span style="position: absolute; right: 10px; color: #8799a3">' + value + '</span>'
                },
                data: []
            })



            fill_blanks_question = xmSelect.render({
                el: '#fill_blanks_question',
                filterable: true,
                paging: true,
                pageSize: 10,
                autoRow: true,
                toolbar: {
                    show: true,
                },
                model: {
                    label: {
                        block: {
                            template: function (item, sels) {
                                return item.value;
                            },
                        },
                    }
                },
                template({item, sels, name, value}) {
                    return item.name + '<span style="position: absolute; right: 10px; color: #8799a3">' + value + '</span>'
                },
                data: []
            })


            $.ajax({
                url: 'get_subject_question_total_by_s_id_and_level',
                dataType: "json",//数据格式
                type: "post",//请求方式
                async: false,//是否异步请求
                data: {
                    s_id: s_id,
                    question_level: question_level
                },
                success: function (data) {
                    if (data.code === 200) {
                        choice_question_data = [];
                        judgment_question_data=[];
                        short_answer_q_data = [];
                        fill_blanks_q_data = [];


                        for (let i = 0; i < data.result.singleChoiceQ.length; i++) {
                            choice_question_data.push({
                                name: "<xmp>" + data.result.singleChoiceQ[i].c_describe + "</xmp>",
                                value: data.result.singleChoiceQ[i].c_id
                            });
                        }
                        choice_question.update({
                            data: choice_question_data
                        })

                        for (let i = 0; i < data.result.judgmentQ.length; i++) {
                            judgment_question_data.push({
                                name: data.result.judgmentQ[i].j_describe,
                                value: data.result.judgmentQ[i].j_id
                            });
                        }
                        judgment_question.update({
                            data: judgment_question_data
                        })

                        for (let i = 0; i < data.result.shortAnswerQ.length; i++) {
                            short_answer_q_data.push({
                                name: data.result.shortAnswerQ[i].sa_describe,
                                value: data.result.shortAnswerQ[i].sa_id
                            });
                        }
                        short_answer_question.update({
                            data: short_answer_q_data
                        })

                        for (let i = 0; i < data.result.fillBlanksQ.length; i++) {
                            fill_blanks_q_data.push({
                                name: data.result.fillBlanksQ[i].fb_describe,
                                value: data.result.fillBlanksQ[i].fb_id
                            });
                        }
                        fill_blanks_question.update({
                            data: fill_blanks_q_data
                        })


                        form.val("example", {
                            "choice_question_total": data.result.singleChoiceQ.length
                            , "judgment_question_total": data.result.judgmentQ.length
                            , "short_answer_question_total": data.result.shortAnswerQ.length
                            , "fill_blanks_question_total": data.result.fillBlanksQ.length
                        });
                        form.render();
                    }
                },
                error: function (e) {
                    alert("出现错误！！");
                }
            });
        });
    }


    function get_all_subject() {
        layui.use(['element', "form", 'jquery', 'layer'], function () {
            const form = layui.form;
            $.ajax({
                url: 'get_all_subject',
                dataType: "json",//数据格式
                type: "post",//请求方式
                async: false,//是否异步请求
                success: function (data) {
                    if (data.code === 200) {
                        var text = ""
                        for (let i = 0; i < data.result.length; i++) {
                            text += "<option value=\"" + data.result[i].s_id + "\">" + data.result[i].s_name + "</option>"
                        }
                        $(".subject").html(text);
                        form.render();
                    }
                },
                error: function (e) {
                    alert("出现错误！！");
                }
            });
        })
    }

    function getDateDiff(dateTimeStamp) {
        var minute = 1000 * 60;
        var hour = minute * 60;
        var day = hour * 24;
        var halfamonth = day * 15;
        var month = day * 30;
        var now = new Date().getTime();
        var diffValue = now - dateTimeStamp;
        if (diffValue < 0) {
            //若日期不符则弹出窗口告之
            //alert("结束日期不能小于开始日期！");
        }
        var monthC = diffValue / month;
        var weekC = diffValue / (7 * day);
        var dayC = diffValue / day;
        var hourC = diffValue / hour;
        var minC = diffValue / minute;
        if (monthC >= 1) {
            result = "创建于" + parseInt(monthC) + "个月前";
        } else if (weekC >= 1) {
            result = "创建于" + parseInt(weekC) + "周前";
        } else if (dayC >= 1) {
            result = "创建于" + parseInt(dayC) + "天前";
        } else if (hourC >= 1) {
            result = "创建于" + parseInt(hourC) + "个小时前";
        } else if (minC >= 1) {
            result = "创建于" + parseInt(minC) + "分钟前";
        } else
            result = "刚刚创建";
        return result;
    }

    //js函数代码：字符串转换为时间戳
    function getDateTimeStamp(dateStr) {
        var time_stamp = Date.parse(dateStr.replace(/-/gi, "/"));
        return getDateDiff(time_stamp)
    }


    //一些自定义方法
    function initialization_method() {
        layui.use(['element', "form", 'jquery', 'layer', 'xmSelect'], function () {
            const form = layui.form;
            form.on('select(test)', function (data) {
                get_question_total();
            });
            form.on('radio(test)', function (data) {
                get_question_total();
            });

            form.on('radio(creat_exam_paper_way)', function (data) {
                if (data.value === "0") {
                    $("#question_num").hide();
                    $("#exam_paper_way_content").show();
                } else {
                    $("#question_num").show();
                    $("#exam_paper_way_content").hide();
                }
            });

            form.on('select(choice_question_num)', function (data) {
                const datas = form.val("example");
                if (Number(datas.choice_question_num) > Number(datas.choice_question_total)) {
                    layer.alert("请重新设置数量", {icon: 5});
                    return false;
                }
            });
            form.on('select(judgment_question_num)', function (data) {
                const datas = form.val("example");
                if (Number(datas.judgment_question_num) > Number(datas.judgment_question_total)) {
                    layer.alert("请重新设置数量", {icon: 5});
                    return false;
                }
            });
            form.on('select(short_answer_question_num)', function (data) {
                const datas = form.val("example");
                if (Number(datas.short_answer_question_num) > Number(datas.short_answer_question_total)) {
                    layer.alert("请重新设置数量", {icon: 5});
                    return false;
                }
            });
            form.on('select(fill_blanks_question_num)', function (data) {
                const datas = form.val("example");
                if (Number(datas.fill_blanks_question_num) > Number(datas.fill_blanks_question_total)) {
                    layer.alert("请重新设置数量", {icon: 5});
                    return false;
                }
            });

        })
    }



    function getArrayItems(arr, num) {
        //新建一个数组,将传入的数组复制过来,用于运算,而不要直接操作传入的数组;
        var temp_array = new Array();
        for (var index in arr) {
            temp_array.push(arr[index]);
        }
        //取出的数值项,保存在此数组
        var return_array = new Array();
        for (var i = 0; i<num; i++) {
            //判断如果数组还有可以取出的元素,以防下标越界
            if (temp_array.length>0) {
                //在数组中产生一个随机索引
                var arrIndex = Math.floor(Math.random()*temp_array.length);
                //将此随机索引的对应的数组元素值复制出来
                return_array[i] = temp_array[arrIndex];
                //然后删掉此索引的数组元素,这时候temp_array变为新的数组
                temp_array.splice(arrIndex, 1);
            } else {
                //数组中数据项取完后,退出循环,比如数组本来只有10项,但要求取出20项.
                break;
            }
        }
        return return_array;
    }
</script>

</html>